﻿@{
    ViewBag.Title = "忘记密码";
}
@section css{
    <style type="text/css">
        label.valid {
            width: 24px;
            height: 24px;
            background: url(/Images/valid.png) center center no-repeat;
            display: inline-block;
            text-indent: -9999px;
        }

        label.error {
            font-weight: bold;
            color: red;
            padding: 2px 8px;
            margin-top: 2px;
        }

        #foundpwdcontent {
            min-height: 400px;
        }

        #foundpwdfrm input, #foundpwdfrm textarea, #foundpwdfrm button, #foundpwdfrm span {
            border-radius: 0px;
        }

        #foundpwdfrm fieldset legend {
            font-size:x-large;
        }

        #forlogin {
            margin-top: 100px;
        }

            #forlogin a:hover {
                text-decoration: none;
                color: #005580;
            }

        .form-item {
            margin-top: 50px;
        }

        #verifycode_img {
            cursor: pointer;
            height: 25px;
            width: 60px;
            padding-left: 5px;
            padding-bottom: 7px;
        }
    </style>
}
<div class="container-fluid" id="foundpwdcontent">
    <div class="row-fluid">
        <div class="span12">
            <div class="row-fluid">
                <div class="span8">
                    <form id="foundpwdfrm">
                        <fieldset>
                            <legend>找回密码</legend>
                            <div class="control-group form-item">
                                <label class="control-label" for="email">电子邮箱地址</label>
                                <div class="controls">
                                    <input type="text" autocomplete="off" class="input-large" name="email" id="email">
                                </div>
                            </div>
                            <div class="control-group form-item">
                                <label class="control-label" for="verifycode">验证码</label>
                                <div class="controls">
                                    <input type="text" autocomplete="off" class="input-large" name="verifycode" id="verifycode">
                                    <img src="/VerificationCode/Index" id="verifycode_img" />
                                </div>
                            </div>
                            <div class="control-group form-item">
                                <div class="controls">
                                    <button id="register" type="submit" class="btn">重置密码</button>
                                    <img src="~/Images/loading.gif" id="loding" style="display: none" />
                                </div>
                            </div>
                        </fieldset>
                    </form>
                    <div id="info" class="alert alert-success" style="display:none;">
                        密码重置请求已成功发送，请登录邮箱按照提示重置你的帐号密码！
                    </div>
                </div>
                <div class="span4">
                    <div id="forlogin">
                        <span class="label label-info">→</span>
                        <a href="/Account/Login">已注册请登录</a>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
@section scripts{
    <script src="~/Scripts/jquery.validate.min.js"></script>
    <script src="~/Scripts/jquery.form.js"></script>
    <script type="text/javascript">

        $(function () {
            $("#info").css({ display: "none" });
            $("#verifycode_img").click(function () {
                showverifycode();
            });

            function showverifycode() {
                var numkey = Math.random() + (new Date().getDate());
                document.getElementById("verifycode_img").src = "/VerificationCode/Index?NumKey=" + numkey;
            }
        })

        $("#foundpwdfrm").validate({
            errorClass: "help-inline",
            rules: {
                email: {
                    required: true,
                    email: true
                },
                verifycode: {
                    required: true
                }
            },
            messages: {
                email: {
                    required: "电子邮件地址为空",
                    email: "电子邮件地址格式错误"
                },
                verifycode: {
                    required: "验证码为空"
                }
            },
            highlight: function (element) {
                $(element).closest('.control-group').removeClass('success').addClass('error');
            },
            success: function (element) {
                element
				.closest('.control-group').removeClass('error').addClass('success');
            }
        });

        $('#foundpwdfrm').on('submit', function (e) {
            e.preventDefault();
            if ($("#foundpwdfrm").valid()) {
                $(this).ajaxSubmit({
                    type: "post",
                    url: "/Account/HandleForgetPassword",
                    beforeSend: function () {
                        $("#loding").show();
                    },
                    success: function (msg) {
                        $("#loding").hide();
                        if (msg.Result == "OK") {
                            $("#foundpwdfrm").hide();
                            $("#info").show();

                        } else {
                            alert(msg.Message);
                        }
                    }
                });
            }
        });
    </script>
}

